{extend name="adminblue/base" /}
{block name="resources"/}
<script type="text/javascript" src="__STATIC__/My97DatePicker/WdatePicker.js"></script>
{/block}
{block name="main"}
<div class="set-style">
	<dl>
		<dt><span style="color:red;margin-right:10px;">*</span>名称：</dt>
		<dd>
			<p><input name="UserCode" id="ap_name" type="text" class="input-common"></p>
			<p class="error">请输入广告位名称</p>
		</dd>
	</dl>
	<dl>
		<dt>广告位关键字：</dt>
		<dd>
			<p><input name="UserCode" id="ap_keyword" type="text" class="input-common" maxlength="60" onkeyup="value=value.replace(/[^a-zA-Z]/ig,'')" onpaste="return false"></p>
			<p class="error">该关键字已被使用</p>
			<p style="color: #999;">广告位关键字可用来调用广告位，关键字必须为英文字符，不得超过60个字符，关键字不可以相同</p>
		</dd>
	</dl>
	<dl>
		<dt>简介：</dt>
		<dd>
			
			<p><textarea class="textarea-common" id="editor"></textarea></p>
		</dd>
	</dl>
	<dl>
		<dt>类别：</dt>
		<dd>
			<p>
				<select id="ap_class" name="account" class="form-control m-b select-common">
					<option value="0">图片</option>
					<option value="4">代码</option>
				</select>
			</p>
		</dd>
	</dl>
	<dl>
		<dt>是否启用：</dt>
		<dd>
			<p>
				<input id="is_use" type="checkbox" class="checkbox" checked="checked">
			</p>
		</dd>
	</dl>
	<dl>
		<dt>所在位置类型：</dt>
		<dd>
			<p>
				<label class="radio inline normal">
					<i class="radio-common selected"><input type="radio" name="type" id="type1" value="1" checked></i>
					<span>PC端</span>
				</label>
				<label class="radio inline normal">
					<i class="radio-common"><input type="radio" name="type" id="type2" value="2"></i> 
					<span>手机端</span>
				</label>
			</p>
		</dd>
	</dl>
	<div class="data-image">
	<dl>
		<dt><span style="color:red;margin-right:10px;">*</span>展示方式：</dt>
		<dd>
			<p id="ap_display">
				<label class="radio normal inline">
					<i class="radio-common selected"><input type="radio" name="ap_display" id="ap_display0" value="0" checked></i>
					<span>可以发布多条并幻灯展示</span>
				</label>
				<label class="radio normal inline">
					<i class="radio-common"><input type="radio" name="ap_display" id="ap_display1" value="1"></i> 
					<span>可以发布多条广告并随机展示</span>
				</label>
				<label class="radio normal inline">
					<i class="radio-common"><input type="radio" name="ap_display" id="ap_display2" value="2"></i>
					<span>只允许发布并展示一条广告</span>
				</label>
			</p>
			<p class="error">请选择展示方式</p>
		</dd>
	</dl>
	<dl>
		<dt><span style="color:red;margin-right:10px;">*</span>宽度：</dt>
		<dd>
			<p><input id="ap_width" type="number" class="input-common harf"><em class="unit">PX</em></p>
			<p class="error">请输入广告位宽度</p>
		</dd>
	</dl>
	<dl>
		<dt><span style="color:red;margin-right:10px;">*</span>高度：</dt>
		<dd>
			<p><input id="ap_height" type="number" class="input-common harf"><em class="unit">PX</em></p>
			<p class="error">请输入广告位高度</p>
		</dd>
	</dl>
	<dl>
		<dt><span style="color:red;margin-right:10px;">*</span>默认图片：</dt>
		<dd>
			<div class="upload-btn-common">
				<div>
					<input class="input-file" name="file_upload" id="uploadAdv" type="file" onchange="imgUpload(this);" title="上传">
					<input type="hidden" id="adv" value="">
				</div>
				
				<input type="text" id="text_adv" class="input-common" readonly="readonly" value="">
				<em>上传</em>								
				<img id="preview_adv" src="__STATIC__/blue/img/upload-common-select.png" data-src="" data-html="true" data-container="body" data-placement="top" data-trigger="manual" data-original-title="" title="">
			</div>
			<p class="error">请上传图片</p>
		</dd>
	</dl>
	<dl>
		<dt>默认背景色：</dt>
		<dd>
			<input id="ap_background_color" type="color" style="width:60px;height:25px;" class="input-common-color" />
		</dd>
	</dl>
	</div>
	<dl>
		<dt></dt>
		<dd>
			<button class="btn-common btn-big" onclick="addShopAdvPositionAjax();">保存</button>
			<button class="btn-common-cancle btn-big" onclick="javascript:history.back(-1);" >返回</button>
		</dd>
	</dl>
</div>	
{/block}
{block name="script"}
<script src="__STATIC__/js/ajax_file_upload.js" type="text/javascript"></script>
<script src="__STATIC__/js/file_upload.js" type="text/javascript"></script>
<script>
function imgUpload(event) {
	var fileid = $(event).attr("id");
	var data = { 'file_path' : UPLOADADV };
	var id = $(event).next().attr("id");
	uploadFile(fileid,data,function(res){
		if(res.code){
			$("#" + id).val(res.data);
			$("#text_" + id).val(res.data);
			$("#preview_"+ id).attr("data-src",__IMG(res.data));
			showTip(res.message,"success");
		}else{
			showTip(res.message,"error");
		}
	});
}

var ap_keyword_is_exists = false;
$("#ap_keyword").change(function(){
	var ap_keyword = $(this).val();
	$.ajax({
		type : "post",
		url : "{:__URL('ADMIN_MAIN/system/check_apkeyword')}",
		data : {"ap_keyword" : ap_keyword},
		success : function(data){
			if(data == 0){
				ap_keyword_is_exists = false;
			}else if(data > 0){
				ap_keyword_is_exists = true;
			}
		}
	})
})

//广告位类型
$("#ap_class").change(function(){
	if($(this).val() == 4){
		$(".data-image").hide();
	}else if($(this).val() == 0){
		$(".data-image").show();
	}
})

//添加广告位
function addShopAdvPositionAjax() {
	var ap_name = $("#ap_name").val();
	var ap_intro = $("#editor").val();
	var ap_class = $("#ap_class").val();
	if($("#is_use").prop("checked")){
		var is_use = 1;
	}else{
		var is_use = 0;
	}
	var ap_display = $("input[type='radio'][name='ap_display']:checked").val();
	var ap_width = $("#ap_width").val();
	var ap_height = $("#ap_height").val();
	var default_content = $("#adv").val();
	var ap_background_color = $("#ap_background_color").val();
	var type = $("input[type='radio'][name='type']:checked").val();
	var ap_keyword = $("#ap_keyword").val();
	if(verify(ap_name,ap_display,ap_width,ap_height,ap_class)){
		$.ajax({
			type : "post",
			url : "{:__URL('ADMIN_MAIN/system/addshopadvposition')}",
			data : {
				'ap_name' : ap_name,
				'ap_intro' : ap_intro,
				'ap_class' : ap_class,
				'is_use' : is_use,
				'ap_display' : ap_display,
				'ap_width' : ap_width,
				'ap_height' : ap_height,
				'default_content' : default_content,
				'ap_background_color' : ap_background_color,
				'type' : type,
				'ap_keyword' : ap_keyword
			},
			success : function(data) {
				if (data["code"] > 0) {
					showTip("添加成功",'success');
					location.href = "{:__URL('ADMIN_MAIN/system/shopadvpositionlist')}";
				}else{
					showTip("添加失败",'error');
				}
			}
		});
	}
}

function verify(ap_name,ap_display,ap_width,ap_height,ap_class){
	if(ap_name.length == 0){
		$("#ap_name").parent().next(".error").show();
		$("#ap_name").focus();
		return false;
	}else{
		$(".error").hide();
	}
	if(ap_keyword_is_exists){
		$("#ap_keyword").parent().next(".error").show();
		$("#ap_keyword").focus();
		return false;
	}else{
		$(".error").hide();
	}
	if(ap_display == undefined && ap_class == 0){
		$("#ap_display").next(".error").show();
		return false;
	}else{
		$(".error").hide();
	}
	if(ap_width.length == 0 && ap_class == 0){
		$("#ap_width").parent().next(".error").show();
		$("#ap_width").focus();
		return false;
	}else{
		$(".error").hide();
	}
	if(ap_height.length == 0 && ap_class == 0){
		$("#ap_height").parent().next(".error").show();
		$("#ap_height").focus();
		return false;
	}else{
		$(".error").hide();
	}
	if($("#adv").val().length ==0 && ap_class == 0){
		$("#adv").parents('dd').find(".error").show();
		return false;
	}else{
		$(".error").hide();
	}
	return true;;
}
</script>
{/block}
